<template>
	<div class="container">
		<navigationBar leftTitle="地址列表"></navigationBar>
		<div class="content" :style="'padding-top: ' + (navigationBarHeight-1) + 'px;'">
			<div class="list">
				<div class="item" v-for="(item,index) in list" :key="index">
					<div class="item-top" @click="submit(item,index)">
						<image v-if="item.isDefault" class="select" src="/static/icons/check-fill.png" mode=""></image>
						<span class="user">{{item.name}} {{item.phone}}</span>
					</div>
					<div class="item-bottom">
						<div class="text" @click="submit(item,index)">{{item.address}} {{item.addressDetail}}</div>
						<image @click="toEdit(item.id)" class="edit" src="/static/icons/edit.png" mode=""></image>
					</div>
				</div>
			</div>
			<div class="footer">
				<div class="btn" @click="toCreateAddress">
					添加新地址
				</div>
			</div>
		</div>

	</div>
</template>

<script>
	import data from '@/js/my/address/data.js';
	import methods from '@/js/my/address/methods.js';
	import {
		mapState
	} from 'vuex';
	import navigationBar from '../../components/navigationBar.vue';
	export default {
		data,
		methods,
		onLoad() {

		},
		onShow() {
			this.getPageData()
		},
		onHide() {},
		components: {
			navigationBar
		},
		computed: {
			...mapState(['navigationBarHeight'])
		}
	};
</script>

<style scoped lang="scss">
	@import '~@/style/my/address.scss';
</style>